<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>修改密码</title>
    <th:block th:include="common :: headerCss"></th:block>
</head>
<body>
<form class="layui-form" action="">
    <div class="layui-form-item">
        <label class="layui-form-label">原密码</label>
        <div class="layui-input-inline">
            <input type="hidden" th:value="${oldPwd}" id="oldPwd">
            <input type="password" name="userPwd" lay-verify="required|oldPwd" placeholder="请输入原密码" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">新密码</label>
        <div class="layui-input-inline">
            <input type="password" name="newPwd" id="newPwd" lay-verify="pass" placeholder="请输入新密码" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-form-mid layui-word-aux">请填写6到12位密码</div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">确认密码</label>
        <div class="layui-input-inline">
            <input type="password" name="pwd" lay-verify="surePass" placeholder="请输入确认密码" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-form-mid layui-word-aux">确认密码与新密码填写保持一致</div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn" lay-submit="" lay-filter="subBtn">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>

</body>
<div th:include="common :: footJs"></div>
<script th:src="@{/static/js/md5.js}"></script>
<script>
    layui.use(['form'], function() {
        var form = layui.form
            , layer = layui.layer;


        //自定义验证规则
        form.verify({
            oldPwd: function(val){
                var oldPwd = $("#oldPwd").val();
                if(MD5.hex_md5(val)!== oldPwd){
                    return "原密码输入错误";
                }
            },
            pass: [
                /^[\S]{6,12}$/
                ,'密码必须6到12位，且不能出现空格'
            ],
            surePass: function (val) {
                var newPwd = $('#newPwd').val();
                if(val == null || val !== newPwd){
                    return "确认密码与新密码必须保持一致";
                }
            }

        });
        //监听提交
        form.on('submit(subBtn)', function(data){
            $.ajax({
                type: 'POST',
                url: "/updatePwd",
                contentType: "application/json; charset=utf-8",//提交数据的格式为json
                data: JSON.stringify(data.field),
                success: function (result) {
                    if (result.code === 0) {
                        layui.layer.msg(result.msg, {icon: 1, time: 2000});
                        //成功后跳转到登录页面
                        window.parent.location.href="/login";

                    } else {
                        layui.layer.alert(result.msg, {icon: 2, time: 2000}, function (index) {
                            layui.layer.close(index);
                        });
                    }
                }
            });
            return false;
        });
    });
</script>
    </html>